<template>

  <div class="home">
    <h1>Home</h1>
    <p>{{ socket }}</p>
  </div>
</template>
  
  <script>

  
  export default {
    name: 'HomeView',
    data() {
      return {
        //wesockets
        path: "ws://localhost:8088/wsserver/111",
        socket:""
      }
    },
    mounted() { // 渲染后执行
    // 初始化
    this.initWebsocket();
},
    methods: {
      //==============webSocket======================
      initWebsocket: function () {
        if(typeof(WebSocket) === "undefined"){
          alert("您的浏览器不支持socket")
        }else{
          // 实例化socket
          this.socket = new WebSocket(this.path)
          // 监听socket连接
          this.socket.onopen = this.open
          // 监听socket错误信息
          this.socket.onerror = this.error
          // 监听socket消息
          this.socket.onmessage = this.getMessage
        }
      },
      open: function () {
        console.log("socket连接成功")
      },
      error: function () {
        console.log("连接错误")
      },
      getMessage: function (msg) {
        console.log(msg.data+"================")
        this.socket = msg.data
      },
      send: function () {
        this.socket.send(params)
      },
      close: function () {
        console.log("socket已经关闭")
      },
      //==============webSocket======================
    },



  }
  </script>
  
  <style>

  </style>
  